

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <title>SummerCampofCost</title>
    <script type="text/javascript" src="https://assets.pyecharts.org/assets/echarts.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.1.2/dist/css/bootstrap.min.css"
          type="text/css">
    <!--    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">-->

    <style type="text/css">
        body {
            background-color: rgb(245, 245, 245) !important;
        }

        p {
            overflow-wrap: break-word;
            word-wrap: break-word;
        }

        .container {
            max-width: 1280px !important;
        }

        .hello-form {
            margin-bottom: 20px;
        }

        header {
            margin: 50px 0 40px 0;
        }

        header h1 {
            font-size: 60px;
            font-weight: bold;
        }

        .sub-title {
            font-size: 24px;
        }

        @media screen and (max-width: 600px) {
            .sub-title {
                display: block;
            }
        }

        header a {
            text-decoration: none !important;
        }

        footer {
            font-size: 22px;
            font-weight: bold;
        }

        .row {
            height: 400px
        }
    </style>

</head>


<body>


<main class="container">

    <header>
        <br>
        <br>
        <br>
        <h1 class="text-center display-1">
            <a href="http://127.0.0.1:5000/" class="text-success"><strong>SummerCamp</strong></a>
            <small class="text-muted sub-title">of cost</small>
        </h1>
        <br>
        <br>
        <br>
    </header>

    {% for message in get_flashed_messages() %}
    <div class="alert alert-info">
        <button type="button" class="close" data-dismiss="alert">&times;</button>
        {{ message }}


    </div>
    {% endfor %}

               <h2 class="text-center " >请选择您想看到的费用类型</h2><br><br><br>


    <br>
    <br>
    <br>
    <div class="row">
        <div class="col-md-6">
            <div class="card text-white bg-warning">


                <br> <br> <br>
                <center>
                    <a
                            href="http://summercamp.weiye.site/budgetpage">
                        <button type="button" class="btn btn-lg" style="width:600px; height:250px;background: none;
border:none;"><strong>预算费用</strong>
                        </button>
                    </a>
                </center>
                <br> <br> <br>

            </div>
        </div>

        <div class="col-md-6">
            <div class="card text-white bg-primary">

                <br> <br> <br>
                <center>
                    <a
                            href="http://summercamp.weiye.site/realpage">
                        <button type="button" class="btn btn-lg" style="width:400px; height:250px;background: none;
border:none;"><strong>真实费用</strong>
                        </button>
                    </a>
                </center>
                <br> <br> <br>
            </div>
        </div>
    </div>



    <footer class="text-center">
        &copy; 2019 <a href="https://github.com/Handsomeweiye" title="Written by WeiYe">Designed by Weiye</a>
    </footer>

</main>


</body>


</html>